import QtQuick 1.1
import com.nokia.meego 1.0


Rectangle {
    id: button

    property string image: ""
    property string textButton: ""
    property int textButtonSize: 16

    radius: 18
    smooth: true
    color: "transparent"

    Image {
        id: imgFrame
        anchors.centerIn: parent
        source: "pictures/button_frame.png"
        smooth: true
    }
    Image {
        id: imgButton
        height: 128
        width: 128
        anchors.centerIn: parent
        smooth: true
        source: image
    }
    BusyIndicator {
        id: busyIndicator
        opacity: 0
        anchors.centerIn: parent
        running:  true
        scale: 1.85
        smooth: true
        platformStyle: BusyIndicatorStyle {
            spinnerFrames: theme.inverted === false  ? "image://theme/spinner" : "image://theme/spinnerinverted"
            size: "large"
        }
    }
    Text {
        id: lblButton
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.top: parent.bottom
        anchors.topMargin: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? -30 : -60
        font.pointSize: textButtonSize
        //font.bold: true
        text: textButton
        color: mytheme.fontMainColor
        smooth: true
    }



    states: [
        State {
                name: "normal"
                when: buttonMouseArea.pressed === false
                PropertyChanges { target: button; scale: 1.00; }
                PropertyChanges { target: busyIndicator; opacity: 0; }
        } ,
        State {
                name: "pressed"
                when: buttonMouseArea.pressed === true
                PropertyChanges { target: button; scale: 0.9; }
                PropertyChanges { target: busyIndicator; opacity: 0.4; }
        }
    ]
    transitions: Transition {  NumberAnimation{ properties: "scale,opacity"; duration: 50 } }


    signal buttonClick()

    MouseArea {
        id: buttonMouseArea
        anchors.fill: parent
        onClicked: {
			buttonClick()
		}
        onPressedChanged: {
            if( pressed ) {
                lblButton.style = Text.Outline;
                lblButton.styleColor = "yellow"
            } else {
                lblButton.style = Text.Normal;
            }
        }

    }
}
